import React from 'react'
import { changeNav } from '../actions'
import { connect } from 'react-redux'
import { Button, List, Radio, WhiteSpace, Toast, Icon } from 'antd-mobile'
import { ajaxGet, ajaxPost } from 'wxAjaxUtil';
import hhistory from '../history'
import { jtSelect } from '../actions/wxCommonAction';

const RadioItem = Radio.RadioItem;
var defaultOption=false;

class SelectGroup extends React.Component {
	constructor(props) {
		super(props);
		this.state = {
			groupData: {},
			res: [],
			value: defaultOption
		};
		this.saveSubGroup = this.saveSubGroup.bind(this);
	}

	componentDidMount() {
		this.props.tochangeNav({
			title: "选择集团", rbtn: [
				<Button key="1" type="primary" inline onClick={this.saveSubGroup} size="small">确定</Button>
			]
		});
		Toast.loading('Loading...');
		var postData = {
			"groupCode":""
		}
		//请求数据
		ajaxPost("/o2o/sly/dic/bd/group/list",postData,'wxApiPath').then(res => {
			if (res.code && res.code == "0") {
				this.setState({
					loading: false,
					res: res.data,
				});
				Toast.hide();

			} else {
				Toast.fail('获取集团列表失败', 1);
			}
		});
	}

	//获取选中集团数据
	selectSubGroup() {
		this.state.groupData = this.state.res[this.state.value];
	}

	//点击确定按钮
	saveSubGroup() {
		this.selectSubGroup();
		defaultOption=this.state.value;
		this.props.jtSelect(jtSelect(this.state.groupData));
		var backRouter = this.props.location.state.backRouter;
		hhistory.push({
			pathname: backRouter,
			state: this.state.groupData
		})
	}

	render() {
		return (
			<div>
				<List>
					{this.state.res.map((i, index) => (
						<div style={{ backgroundColor: '#f7f7f7' }}>
							<WhiteSpace />
							<div style={{position:'relative', height: '80px', backgroundColor: '#ffffff' }} key={index} onClick={() => this.onChange(index)}>
								<img style={{ height: '60px',width:'60px',float:'left',marginLeft:'25px',marginTop:'10px',borderRadius:'15%' }} src={i.logo} />
								<div style={{position:'absolute',left:'120px',top:'20px'}}>{i.name}</div>
								{
									this.state.value === index
										? <Icon style={{float:'right',marginRight:'20px',marginTop:'20px'}} type={require('./assets/icon_danxuan_2.svg')} size={"sm"} />
										: <Icon style={{float:'right',marginRight:'20px',marginTop:'20px'}} type={require('./assets/icon_danxuan_1.svg')} size={"sm"} />
								}

							</div>
						</div>
					))}
				</List>

			</div>
		)
	}

	state = {
		value: 0
	}

	onChange = (value) => {
		this.setState({
			value: value,
		});
	}
}

const mapStateToProps = (state) => ({

})
const mapDispatchToProps = (dispatch) => ({
	tochangeNav: navogj => dispatch(changeNav(navogj)),
	jtSelect: action => { dispatch(action) }
})

export default connect(mapStateToProps, mapDispatchToProps)(SelectGroup)